<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>03猜数字</title>
</head>
<body>
<button onclick="alert('警告信息')">测试警告框</button>
<button onclick="confirm('您确定要关闭吗!')">测试确定框</button>
<button onclick="prompt('请输入你的设备码')">测试输入框</button>

<h4>已生成一个1~100之间的随机数:</h4>
<input type="text">
<button onclick="f()">点我验证</button>
<h4>小提示:<span></span></h4>

<script>
    let r = parseInt(Math.random() * 100) + 1;
    console.log('打个小抄' + r);
    let count=0;
    function f() {
        let n = document.querySelector('input').value
        if (isNaN(n)){
            alert('请输入数字');
            return;
        }

        let spanE = document.querySelector('span');//通过选择器找到对应的HTML元素
        count++;
        if (n > r) {
            spanE.innerHTML = '猜大了!';
        } else if (n < r) {
            spanE.innerHTML = '猜小了!';
        } else {
            spanE.innerHTML = ('恭喜你用了' + count+ '次就猜对了!');
        }
    }
</script>
</body>
</html>